<template>
  <el-dialog v-model="open" title="项目列表" v-if="isDialog" destroy-on-close append-to-body>
    <crudViewV2 :config="dialogConfig" ref="crudDialog" />
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="closeDialog">关闭</el-button>
        <el-button type="primary" @click="confirm">确 定</el-button>
      </span>
    </template>
  </el-dialog>
  <crudViewV2 :config="dialogConfig" v-else ref="crudView" />
</template>
<script setup name="ProjectList">
// 项目列表
import { reactive, toRefs } from 'vue';
import Api from '@/api/index';

const emit = defineEmits(['confirm']);

const props = defineProps({
  // 是否以dialog的形式
  isDialog: {
    type: Boolean,
    default: false,
  },
});

const pageData = reactive({
  open: false,
  dialogConfig: {
    option: {
      searchLabelWidth: 80,
      delBtn: false,
      editBtn: false,
      addBtn: false,
      menu: false,
      column: [
        {
          label: '项目名称',
          prop: 'projectName',
          search: true,
        },
        {
          label: '客户',
          prop: 'fCustName',
          search: true,
        },
      ],
    },
    customOption: {
      operate: {
        get: Api.pdp.erpOrderConfigure.list,
      },
      queryParams: {},
      maxSelectionCount: 1,
    },
  },
});

const { open, dialogConfig } = toRefs(pageData);

const crudDialog = ref(null);
const crudView = ref(null);

// 打开弹窗
const openDialog = () => {
  open.value = true;
};

// 关闭弹窗
const closeDialog = () => {
  open.value = false;
};

// 确定
const confirm = () => {
  emit('confirm', crudDialog.value.selectData);
  open.value = false;
};

defineExpose({
  openDialog,
});
</script>
